<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>天禾汽车租赁系统-账户管理</title>
    <link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
    <link rel="stylesheet" href="/static/css/common.css">
</head>
<body>
    <div class="wrap-padding-15">

        <span class="layui-breadcrumb">
          <a href="/" target="_top">首页</a>
          <a href="/user">账户管理</a>
          <a><cite>增加</cite></a>
        </span>

        <div class="box-form">
            <form action="/user/save" method="post" class="layui-form" id="uAddForm">
                <div class="layui-form-item">
                    <label class="layui-form-label">账户：</label>
                    <div class="layui-input-block">
                        <input type="text" name="username"  lay-verify="required|userName" placeholder="请输入账户" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">昵称：</label>
                    <div class="layui-input-block">
                        <input type="text" name="nickname"  lay-verify="required" placeholder="请输入昵称" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">姓名：</label>
                    <div class="layui-input-block">
                        <input type="text" name="realname"  lay-verify="required" placeholder="请输入姓名" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">手机号：</label>
                    <div class="layui-input-block">
                        <input type="text" name="mobile"  lay-verify="required|phone|number" placeholder="请输入手机号" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">邮箱：</label>
                    <div class="layui-input-block">
                        <input type="text" name="email"  lay-verify="required|email" placeholder="请输入邮箱" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">工号：</label>
                    <div class="layui-input-block">
                        <input type="text" name="personid"  lay-verify="required" placeholder="请输入工号" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">租赁店：</label>
                    <div class="layui-input-block">
                        <input type="text" name="deptname"  lay-verify="required" placeholder="请输入租赁店" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">初始密码：</label>
                    <div class="layui-input-block">
                        <input type="text" name="password"  lay-verify="required|password" placeholder="请输入密码" autocomplete="off" class="layui-input">
                    </div>
                </div>


                <div class="layui-form-item">
                    <label class="layui-form-label">角色：</label>
                    <div class="layui-input-block">
                        <select name="rolecode" id="roleId" lay-verify="required" lay-filter="type">
                            <c:forEach items="${roleList}" var="role">
                                <option value="${role.roleid}">${role.rolename}</option>
                            </c:forEach>
                        </select>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">账户状态：</label>
                    <div class="layui-input-block">
                        <input type="checkbox" name="userstate" value="1" title="启用">
                    </div>
                    <div class="layui-form-mid layui-word-aux">禁用状态下账户不能登录</div>
                </div>

                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit lay-filter="formSubmit">提交</button>
                        <a href="/user"><button type="button" class="layui-btn layui-btn-primary">取消</button></a>

                    </div>
                </div>
            </form>
        </div>

    </div>


<script src="/static/plugins/jquery.js"></script>
<script src="/static/plugins/layui/layui.js"></script>
<script>
    layui.use(['element','layer','form'],function () {
        var form = layui.form
        var layer = layui.layer

        /*form.on('submit(formSubmit)',function (data) {
            var serialize = $("#uAddForm").serialize();
            console.log(serialize)
            $.ajax({
                url:"/user/sendEmail",
                type:"post",
                dataType:"json",
                data:serialize,
                success:function (msg) {
                    layer.msg(msg.msg)
                },
                error:function () {
                    layer.msg("服务器异常")
                }
            })
        })*/

        form.verify({
            userName: function(value, item){ //value：表单的值、item：表单的DOM对象
                if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)){
                    return '用户名不能有特殊字符';
                }
                if(/(^\_)|(\__)|(\_+$)/.test(value)){
                    return '用户名首尾不能出现下划线\'_\'';
                }
                if(/^\d+\d+\d$/.test(value)){
                    return '用户名不能全为数字';
                }

                var unique = false;
                $.ajax({
                    url: "/user/onlyOne",
                    data:{userName : value},
                    async:false,
                    success:function(msg){
                        if(msg.code == 1) {
                            unique = msg.data;
                        }
                    },
                    error:function(){
                        console.log("校验用户名唯一性失败");
                    }
                });
                if(unique) {
                    return "用户名已存在";
                }
            }
            ,password: [
                /^[\S]{6,12}$/
                ,'密码必须6到12位，且不能出现空格'
            ]
        });
    })
</script>
</body>
</html>